import './App.css';
import CreateList from "./CreateList/CreateList"
import React, {useState} from "react"
import {AppstoreOutlined} from '@ant-design/icons';
import {Route, Routes} from "react-router-dom";
import CreateCamping from "./CreateCamping/CreateCamping"
import {Layout, Menu, theme} from 'antd';
import UpdateList from "./UpdateList/UpdateList"
import UpdateCourt from "./UpdateCourt/UpdateCourt"
import {CookiesProvider, useCookies} from "react-cookie";


const {Header, Content, Footer, Sider} = Layout;

function getItem(label, key, icon, children, type) {
    return {
        key,
        icon,
        children,
        label,
        type,
    };
}

const items = [
    getItem('审核管理', 'review', <AppstoreOutlined/>, [
        getItem('新营地', 'create'),
        getItem('修改营地', 'update'),
    ])
]

function App() {
    const [collapsed, setCollapsed] = useState(false);
    const {
        token: {colorBgContainer},
    } = theme.useToken();

    const [currentRoute, setCurrentRoute] = useState("home");

    const handleMenuClick = (route) => {
        setCurrentRoute(route.path);
    };

    const [cookies, setCookie] = useCookies(["user"]);

    if (!cookies?.user) {
        window.location.href = "/login"
    }

    return (
        <CookiesProvider>
            <Layout style={{minHeight: '100vh'}}>
                <Sider breakpoint="lg"
                       collapsedWidth="0">
                    <div className="demo-logo-vertical"/>
                    <Menu
                        theme={'dark'}
                        mode="inline"
                        selectedKeys={[currentRoute]}
                        onSelect={handleMenuClick}
                    >
                        <Menu.SubMenu key="review" title="审核营地">
                            <Menu.Item key="/review/create">
                                <a href="/review/create">新营地</a>
                            </Menu.Item>
                            <Menu.Item key="/review/update">
                                <a href="/review/update">修改营地</a>
                            </Menu.Item>
                        </Menu.SubMenu>
                    </Menu>
                </Sider>
                <Layout>
                    <Header style={{padding: 0, background: colorBgContainer}}/>
                    <Content style={{margin: '0 16px'}}>
                        <Routes>
                            <Route path="/review/create" element={<CreateList/>}/>
                            <Route path="/camping/create/:id" element={<CreateCamping/>}/>
                            <Route path="/review/update" element={<UpdateList/>}/>
                            <Route path="/camping/update/:id" element={<UpdateCourt/>}/>
                        </Routes>
                    </Content>
                    <Footer style={{textAlign: 'center'}}>Ant Design ©2023 Created by Ant UED</Footer>
                </Layout>
            </Layout>
        </CookiesProvider>
    );
}

export default App;
